@import "../../../styles/base";

@function tovw($size) {
  @return #{$size / 3.6}vw;
}


.GiftResult {
  text-align: center;
  .title {
    font-size: tovw(16);
    color: #1C1D1F;
    text-align: center;
    font-weight: 500;
    margin-bottom: tovw(20);
  }

  ul {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-wrap: wrap;
    padding: 0 tovw(4);
    margin: auto;

    li {
      flex: 0 0 25%;
      padding: tovw(6.5);

      .wrap {
        display: flex;
        justify-content: center;
        align-items: center;
        flex-direction: column;
        background: #FFFFFF;
        position: relative;

        .img {
          height: tovw(70);
          width: tovw(70);
          background: #FFFFFF;
          border: 1px solid rgba(148,86,253,1);
          border-radius: tovw(7.94);
          padding: tovw(9);
          display: flex;
          justify-content: center;
          align-items: center;

          img {
            width: 100%;
            height: 100%;
            object-fit: contain;
          }
        }

        .desc {
          font-size: tovw(14);
          color: #1C1D1F;
          letter-spacing: 0;
          font-weight: 500;
        }
      }
    }
  }

  .jump-btn {
    font-size: tovw(14);
    color: #FFFFFF;
    letter-spacing: 0;
    text-align: center;
    font-weight: 500;
    width: tovw(190);
    height: tovw(36);
    margin: tovw(18) auto;
    background: #9456FD;
    border-radius: tovw(18);
  }
}
